<template>
    <div id="app">
      <div id="header">
        <router-link to="/">
          <span class="item">所有悬赏</span>
        </router-link>
        <router-link to="/create">
          <span class="item">新建悬赏</span>
        </router-link>
        <router-link to="/take">
          <span class="item">领取悬赏</span>
        </router-link>
        <router-link to="/my">
          <span class="item">我的悬赏</span>
        </router-link>
        <router-link to="/about">
          <span class="item">关于</span>
        </router-link>
      </div>
      <router-view></router-view>
    </div>
</template>

<script>
import util from './util';

export default {
  name: 'app',
  created() {
    if (util.noWallet) {
      var content = `<p>检测到你还没安装浏览器钱包插件，请先<a href="https://github.com/ChengOrangeJu/WebExtensionWallet" target="_blank">安装 NAS 钱包插件</a></p><br>
              <p>如果你还没有创建 NAS 钱包，可以参考官方教程进行创建「<a href="https://blog.nebulas.io/2018/04/12/creating-a-nas-wallet/" target="_blank">星云Web钱包教程1：创建NAS钱包</a>」</p><br>
              <p>确认导入钱包并解锁后，请刷新页面重新进行操作 :)</p>`;
      this.$alert(content, '请先安装浏览包器钱插件', {
        confirmButtonText: '确定',
        dangerouslyUseHTMLString: true
    });
    };
  },
  data () {
    return {
      visible: false,
      activeTab: 'first'
    }
  }
};
</script>

<style>
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
    width: 800px;
    margin: 0 auto;
  }

  body {
    background-color: #f6f6f6;
  }

  #header {
    height: 60px;
    padding-left: 60px;
    padding-right: 60px;
    background-color: #0084ff;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  a:link {text-decoration:none;}
  a:active {text-decoration:none;}
  a:visited {text-decoration:none;}
  a:hover {text-decoration:underline;}

  .item {
    color: #fff;
    font-size: 18px;

  }


</style>
